<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
	<h1></h1>
	<script>
		//1，创建ajax对象
		var xhr = new XMLHttpRequest();
		//4，监听请求   一定要保证发送请求之前进行监听。
		xhr.onreadystatechange = function(){
			//xhr对象的readyState属性发生了改变，这个事件就会被触发
			//readyState:
			//0 ===>xhr对象已经创建，但是还没有进行初始化操作
			//1===> xhr对象已经调用了open
			//2===> xhr已经发出ajax请求
			//3===> 已经返回了部分数据
			//4===> 数据已经全部返回
			if(xhr.readyState !==4){
				return;
			}
			if(xhr.status >=200&& xhr.status<= 300){
				//数据放在了xhr.responseText的属性中（String)
				document.querySelector('h1').innerHTML = xhr.responseText;
			}else{
				console.error('请求失败');
			}
		}
		//2, 打开这个对象   true为异步发送请求
		xhr.open('get','./text.txt',true);
		//3, 发送请求
		xhr.send();
	</script>
</body>
</html>